<template>
	<view class="wap">
		<navbar :parameter='parameter'></navbar>
		<view class="form-box" :style="{'top':navHeight+'rpx'}">
			<view class="box form">
				<view class="line acea-row ">
					<view class="tit"> 申请人姓名 </view>
					<view class="text"> {{list.member_name}} </view>
				</view>
				<view class="line acea-row ">
					<view class="tit"> 申请人电话 </view>
					<view class="text"> {{list.phone}} </view>
				</view>
				<view class="line acea-row ">
					<view class="tit"> 家庭住址 </view>
					<view class="text"> {{list.city}} </view>
				</view>
				<view class="line acea-row ">
					<view class="tit"> 具体地址 </view>
					<view class="text"> {{list.address}} </view>
				</view>
				<view class="line acea-row ">
					<view class="tit"> 病情描述 </view>
					<view style="line-height: 100%;flex: 1;padding: 15rpx 0;"> {{list.remark}} </view>
				</view>
				<view class="line" v-if="list.images">
					<view class="tit">病情图片</view>
					<view class="upload-item" style="margin-bottom: 20rpx;">
						<view class="upload-box">
							<image v-for="(item,index) in fileList1" :key="index" :src="imageUrl+item" @click="viewImage(index)" mode="widthFix" style="width: 154rpx;height: 154rpx;"></image>
						</view>
					</view>
				</view>
				<view class="line acea-row ">
					<view class="tit"> 专员姓名 </view>
					<view class="text"> {{list.info.name}} </view>
				</view>
				<view class="line acea-row ">
					<view class="tit"> 专员电话 </view>
					<view class="text"> {{list.info.mobile}} </view>
				</view>
				<view class="line acea-row">
					<view class="tit"> 专员性别 </view>
					<view class="text"> {{list.info.sex}} </view>
				</view>
				<view class="line acea-row">
					<view class="tit"> 专员背景 </view>
					<view class="text"> {{list.info.background}} </view>
				</view>
			</view>
			
			<view @click="callphone()" class="order-btn">立即联系</view>
		</view>
		<u-loading-page :loading="isdown"></u-loading-page>
	</view>
</template>

<script>
	let app = getApp();
	const d = new Date()
	const year = d.getFullYear();
	export default {
		data() {
			return {
				parameter: {
					'navbar': '1',
					'return': '1',
					'title': '临床试验详情',
					'color': false,
				},
				navHeight: app.globalData.navHeight,
				imageUrl: this.imageUrl,
				id:'',
				type:'',
				fileList1:[],
				list: {},
				isdown: true
			};
		},
		onLoad(option) {
			this.id = option.id;
			this.type = option.type;
			this.orderInfo(option.id)
		},
		onShow() {

		},
		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage: function() {
			
		},
		onShareTimeline(res) { //分享到朋友圈

		},
		methods: {
			viewImage(index) {
				let imageUrl = this.imageUrl;
				let imgArr = [];
				this.fileList1.forEach(function(item) {
					imgArr.push(imageUrl+item)
				});
				uni.previewImage({
					urls: imgArr,
					current: index
				});
			},
			async orderInfo(id) {
				const res = await this.$myRequest({
					url: '/api/lcsy/order_detail',
					data: {
						openid: uni.getStorageSync('openid'),
						id: id
					}
				})
				// console.log("订单详情", res.data.data);
				if(res.data.data.images){
					this.fileList1 = res.data.data.images.split(',')
				}
				this.list = res.data.data;
				this.isdown = false;
			},
			callphone(){
				let phone
				if(this.type == 1){
					phone = this.list.phone;
				}else{
					phone = this.list.info.mobile;
				}
				uni.makePhoneCall({
					phoneNumber: phone, //电话号码
					success: function(e) {
						console.log(e);
					},
					fail: function(e) {
						console.log(e);
					}
				})
			},
			seek(){
				uni.navigateTo({
					url:'/bundle/pages/about/seek?id='+this.id
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.wap {
		position: relative;
		padding: 0;
	}
	.form-box {
		position: absolute;
		width: 100%;
		left: 0;
		padding:30rpx;
	}

	.box {
		width: 100%;
		padding: 0 30rpx;
		background-color: #fff;
		border-radius: 20rpx;
		margin-bottom: 30rpx;
	}

	.name-box {
		color: #000;
		font-size: 28rpx;
	}

	.name-box .iconfont {
		color: #347DFE;
		font-size: 32rpx;
		margin-right: 10rpx;
	}


	.form .line {
		font-size: 28rpx;
		line-height: 100rpx;
		border-bottom: 1px solid #D9D9DA;

	}

	.form .line:last-child {
		border-bottom: none;
	}

	.form .line .tit {
		color: #000;
		width: 200rpx;
	}

	.form .line .text {
		color: #000;
		flex: 1;
		height: 100rpx;
		line-height: 100rpx;
		text-align: right;
	}

	.form .line.picker {
		padding-right: 30rpx;
		position: relative;
	}

	.form .line.picker::after {
		content: "\e61f";
		font-family: "iconfont";
		display: block;
		position: absolute;
		font-size: 24rpx;
		color: #b4b4b4;
		top: 0;
		right: 0rpx;
		line-height: 100rpx;
	}

	.form .line textarea {
		width: 100%;
		height: 130rpx;
		border: 1px solid #D9D9DA;
		border-radius: 12rpx;
		padding: 30rpx;
		margin-bottom: 20rpx;
		line-height: 1.4;
	}

	.order-btn {
		border-radius: 20rpx;
		height: 90rpx;
		background: #347DFE;
		color: #fff;
		text-align: center;
		line-height: 90rpx;
		margin: 30rpx 0;
	}
	
</style>
